define(["lib/swipeslider.min"], function () {
    //ly 渲染数据
    var request = function(){
        var shop_id = App.input(1); 
        if(!shop_id){
            App.toast("店铺不存在");
            return;
        }
        var base_url = App.url("gatewory?mod=Shop&cla=IndexController&act=shopOutside");
        App.get(base_url,{
            param:{
                shop_id:shop_id
            }
        },function(d){
            if(d.code === 1000){
                rendor(d.data);
            }
        });
    };
    var rendor=function(d){
        App.log(d)
        App.load_view("page/store/index",{d:d});
    };
    App.myApp.onPageInit("page.store.index", function () {
        $('.navbar').removeClass('navbar-scroll');
        // 商铺首页banner滚动
        $('#banner-store').swipeslider();
        // 页面滚动navbar切换
        $('.store-scroll').scroll(function () {
            if ($('.store-scroll').scrollTop() > 0) {
                $('.store-navbar-inner').addClass('store-navbar-inner-scroll');
            } else {
                $('.store-navbar-inner').removeClass('store-navbar-inner-scroll');
            }
            // tab固定
            if ($('.store-tab').offset().top < 44) {
                $('.tab-title').addClass('tab-title-fixed');
                $('.intro-box').css({'padding-top':'50px'});
            }else{
                $('.tab-title').removeClass('tab-title-fixed');
                $('.intro-box').css({'padding-top':'0.7rem'});
            }
        });
        // 右上角菜单栏
        $('.top-menu').click(function(){
            $('.top-menu-list').toggle();
        });

        // 店铺资料画圆圈
        //x,y 坐标,radius 半径,process 百分比,backColor 中心颜色, proColor 进度颜色, fontColor 中心文字颜色
        function DrowProcess1(x, y, radius, process, backColor, proColor, fontColor) {
            var canvas1 = document.getElementById('canvas1');

            if (canvas1.getContext) {
                var cts1 = canvas1.getContext('2d');
            } else {
                return;
            }

            cts1.beginPath();
            // 坐标移动到圆心
            cts1.moveTo(x, y);
            // 画圆,圆心是24,24,半径24,从角度0开始,画到2PI结束,最后一个参数是方向顺时针还是逆时针
            cts1.arc(x, y, radius, 0, Math.PI * 2, false);
            cts1.closePath();
            // 填充颜色
            cts1.fillStyle = backColor;
            cts1.fill();

            cts1.beginPath();
            // 画扇形的时候这步很重要,画笔不在圆心画出来的不是扇形
            cts1.moveTo(x, y);
            // 跟上面的圆唯一的区别在这里,不画满圆,画个扇形
            cts1.arc(x, y, radius, Math.PI * 1.5, Math.PI * 1.5 - Math.PI * 2 * process / 5, true);
            cts1.closePath();
            cts1.fillStyle = proColor;
            cts1.fill();

            //填充背景白色
            cts1.beginPath();
            cts1.moveTo(x, y);
            cts1.arc(x, y, radius - (radius * 0.1), 0, Math.PI * 2, true);
            cts1.closePath();
            cts1.fillStyle = 'rgba(255,255,255,1)';
            cts1.fill();

            // 画一条线
            cts1.beginPath();
            cts1.arc(x, y, radius - (radius * 0.1), 0, Math.PI * 2, true);
            cts1.closePath();
            // 与画实心圆的区别,fill是填充,stroke是画线
            cts1.strokeStyle = backColor;
            cts1.stroke();

            //在中间写字
            cts1.font = "23px arial";
            cts1.fillStyle = fontColor;
            cts1.textAlign = 'center';
            cts1.textBaseline = 'middle';
            cts1.moveTo(x, y);
            process = process + "";
            cts1.fillText(process.substring(0, process.indexOf(".") + 3), x, y);

        }

        //x,y 坐标,radius 半径,process 百分比,backColor 中心颜色, proColor 进度颜色, fontColor 中心文字颜色
        function DrowProcess2(x, y, radius, process, backColor, proColor, fontColor) {
            var canvas2 = document.getElementById('canvas2');

            if (canvas2.getContext) {
                var cts2 = canvas2.getContext('2d');
            } else {
                return;
            }

            cts2.beginPath();
            // 坐标移动到圆心
            cts2.moveTo(x, y);
            // 画圆,圆心是24,24,半径24,从角度0开始,画到2PI结束,最后一个参数是方向顺时针还是逆时针
            cts2.arc(x, y, radius, 0, Math.PI * 2, false);
            cts2.closePath();
            // 填充颜色
            cts2.fillStyle = backColor;
            cts2.fill();

            cts2.beginPath();
            // 画扇形的时候这步很重要,画笔不在圆心画出来的不是扇形
            cts2.moveTo(x, y);
            // 跟上面的圆唯一的区别在这里,不画满圆,画个扇形
            cts2.arc(x, y, radius, Math.PI * 1.5, Math.PI * 1.5 - Math.PI * 2 * process / 5, true);
            cts2.closePath();
            cts2.fillStyle = proColor;
            cts2.fill();

            //填充背景白色
            cts2.beginPath();
            cts2.moveTo(x, y);
            cts2.arc(x, y, radius - (radius * 0.1), 0, Math.PI * 2, true);
            cts2.closePath();
            cts2.fillStyle = 'rgba(255,255,255,1)';
            cts2.fill();

            // 画一条线
            cts2.beginPath();
            cts2.arc(x, y, radius - (radius * 0.1), 0, Math.PI * 2, true);
            cts2.closePath();
            // 与画实心圆的区别,fill是填充,stroke是画线
            cts2.strokeStyle = backColor;
            cts2.stroke();

            //在中间写字
            cts2.font = "23px arial";
            cts2.fillStyle = fontColor;
            cts2.textAlign = 'center';
            cts2.textBaseline = 'middle';
            cts2.moveTo(x, y);
            process = process + "";
            cts2.fillText(process.substring(0, process.indexOf(".") + 3), x, y);

        }

        //x,y 坐标,radius 半径,process 百分比,backColor 中心颜色, proColor 进度颜色, fontColor 中心文字颜色
        function DrowProcess3(x, y, radius, process, backColor, proColor, fontColor) {
            var canvas3 = document.getElementById('canvas3');

            if (canvas3.getContext) {
                var cts3 = canvas3.getContext('2d');
            } else {
                return;
            }

            cts3.beginPath();
            // 坐标移动到圆心
            cts3.moveTo(x, y);
            // 画圆,圆心是24,24,半径24,从角度0开始,画到2PI结束,最后一个参数是方向顺时针还是逆时针
            cts3.arc(x, y, radius, 0, Math.PI * 2, false);
            cts3.closePath();
            // 填充颜色
            cts3.fillStyle = backColor;
            cts3.fill();

            cts3.beginPath();
            // 画扇形的时候这步很重要,画笔不在圆心画出来的不是扇形
            cts3.moveTo(x, y);
            // 跟上面的圆唯一的区别在这里,不画满圆,画个扇形
            cts3.arc(x, y, radius, Math.PI * 1.5, Math.PI * 1.5 - Math.PI * 2 * process / 5, true);
            cts3.closePath();
            cts3.fillStyle = proColor;
            cts3.fill();

            //填充背景白色
            cts3.beginPath();
            cts3.moveTo(x, y);
            cts3.arc(x, y, radius - (radius * 0.1), 0, Math.PI * 2, true);
            cts3.closePath();
            cts3.fillStyle = 'rgba(255,255,255,1)';
            cts3.fill();

            // 画一条线
            cts3.beginPath();
            cts3.arc(x, y, radius - (radius * 0.1), 0, Math.PI * 2, true);
            cts3.closePath();
            // 与画实心圆的区别,fill是填充,stroke是画线
            cts3.strokeStyle = backColor;
            cts3.stroke();

            //在中间写字
            cts3.font = "1.4rem arial";
            cts3.fillStyle = fontColor;
            cts3.textAlign = 'center';
            cts3.textBaseline = 'middle';
            cts3.moveTo(x, y);
            process = process + "";
            cts3.fillText(process.substring(0, process.indexOf(".") + 3), x, y);

        }

        bfb1 = 0;
        bfb2 = 0;
        bfb3 = 0;
        data1 = $('.data1').text();
        data2 = $('.data2').text();
        data3 = $('.data3').text();
        time = 0;

        function Start1() {
            DrowProcess1(40, 40, 35, bfb1, '#fff3da', '#ffb619', '#ff7713');

            t1 = setTimeout(Start1, 3);
            if (bfb1 >= data1) {
                clearTimeout(t1);
                bfb1 = 0;
                return;
            }
            bfb1 += 0.01;
        }

        function Start2() {
            DrowProcess2(40, 40, 35, bfb2, '#fff3da', '#ffb619', '#ff7713');

            t2 = setTimeout(Start2, 3);
            if (bfb2 >= data2) {
                clearTimeout(t2);
                bfb2 = 0;
                return;
            }
            bfb2 += 0.01;
        }

        function Start3() {
            DrowProcess3(40, 40, 35, bfb3, '#fff3da', '#ffb619', '#ff7713');

            t3 = setTimeout(Start3, 3);
            if (bfb3 >= data3) {
                clearTimeout(t3);
                bfb3 = 0;
                return;
            }
            bfb3 += 0.01;
        }

        var flag = 0;
        $('.tab-intro').click(function () {
            if (flag == 0) {
                Start1();
                Start2();
                Start3();
            }
            flag = 1;
        });
        // 百度地图
        require(['jquery','async!BMap'], function () {
            //创建和初始化地图函数：
            function initMap(){
                createMap();//创建地图
                setMapEvent();//设置地图事件
                addRemark();//向地图中添加文字标注
            }

            //创建地图函数：
            function createMap(){
                var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
                var pointX = $('#point-x').text();//获取坐标X
                var pointY = $('#point-y').text();//获取坐标Y
                var point = new BMap.Point(pointX,pointY);//定义一个中心点坐标
                map.centerAndZoom(point,13);//设定地图的中心点和坐标并将地图显示在地图容器中
                window.map = map;//将map变量存储在全局
            }

            //地图事件设置函数：
            function setMapEvent(){
                map.enableDragging();//启用地图拖拽事件，默认启用(可不写)
                map.enableScrollWheelZoom();//启用地图滚轮放大缩小
                map.enableDoubleClickZoom();//启用鼠标双击放大，默认启用(可不写)
                map.enableKeyboard();//启用键盘上下左右键移动地图
            }

            //文字标注数组
            var pointX = $('#point-x').text();
            var pointY = $('#point-y').text();
            var companyName = $('#company-name').text();
            var lbPoints = [{point:pointX+"|"+pointY,content:companyName}];
            //向地图中添加文字标注函数
            function addRemark(){
                for(var i=0;i<lbPoints.length;i++){
                    var json = lbPoints[i];
                    var p1 = json.point.split("|")[0];
                    var p2 = json.point.split("|")[1];
                    var label = new BMap.Label("<div style='padding:2px;'>"+json.content+"</div>",{point:new BMap.Point(p1,p2),offset:new BMap.Size(3,-6)});
                    map.addOverlay(label);
                    label.setStyle({borderColor:"#999"});
                }
            }

            //默认的店铺资料标签页是隐藏的dituContent没有高度宽度，点击店铺资料标签的时候循环判断页面是否已显示，显示后再初始化地图，否则地图中心点显示在左上角
            $('.tab-intro').click(function () {
                var interval = setInterval(function(){
                    if($('#tab-intro').hasClass('active')){
                        initMap();//创建和初始化地图
                        clearInterval(interval);
                    }
                },1000);

            });
        });
    });
    request();
});